<div class="main-container">
    <form class="layui-form" action="" method="post" lay-filter="baseInfo" id="account-userinfo-form">
        <div class="layui-form-item hui-userinfo-avatar-show" style="margin-top:20px">
            <div class="avatar hui-upload-avatar">
                <i></i>
                <input type="hidden" name="avatar" class="layui-input layui-input-disabled"
                       id="adminInfoAvatar">
                <img src="" id="adminInfoAvatarImg">
                <div class="cover">点击编辑</div>
            </div>
            <div class="username"></div>
            <div class="email"></div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">登录账户</label>
            <div class="layui-input-block">
                <input type="text" name="username" class="layui-input" readonly="readonly" disabled="disabled">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">昵称</label>
            <div class="layui-input-block">
                <input type="text" name="nickname" class="layui-input" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">邮箱</label>
            <div class="layui-input-block">
                <input type="email" name="email" class="layui-input" lay-verify="email">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-block">
                <input type="number" name="mobile" class="layui-input" lay-verify="phone">
            </div>
        </div>

        <div class="bottom">
            <div class="button-container">
                <button type="submit" class="layui-btn layui-btn-sm" lay-submit=""
                        lay-filter="data-save">
                    <i class="layui-icon layui-icon-ok"></i>
                    提交
                </button>
                <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
                    <i class="layui-icon layui-icon-refresh"></i>
                    重置
                </button>
            </div>
        </div>
    </form>
</div>
<script>
  layui.use(['form', 'jquery', 'upload'], function () {
    let form = layui.form;
    let $ = layui.jquery;
    var layuiUpload = layui.upload
    form.render();
    $.ajax({
      url: "/app/admin/account/info",
      dataType: "json",
      success: function (res) {
        form.val("baseInfo", res.data);
        $("#adminInfoAvatarImg").attr("src", res.data.avatar);
      }
    });

    //上传头像
    layuiUpload.render({
      elem: '.hui-upload-avatar'
      , url: "/app/admin/upload/upload"
      , before: function (obj) {
        obj.preview(function (index, file, result) {

        });
      }
      , done: function (res) {
        if (res.code != 200 && res.state != 'SUCCESS') {
          return hui_toast('error', res.msg);
        }
        return hui_toast('success', res.msg, function () {
          $('.hui-upload-avatar img').attr('src', res.url);
          $('#adminInfoAvatar').val(res.url);
          //修改头像
          $.post("/app/admin/account/index", {avatar: res.url});
        });
      }
    });

    form.on('submit(data-save)', function (data) {
      $.ajax({
        url: "/app/admin/account/index",
        dataType: "json",
        type: "POST",
        data: data.field,
        success: function (res) {
          if (res.code !== 200) {
            return hui_toast('error', res.msg);
          }
          return hui_toast('success', "操作成功");
        }
      });
      return false;
    });
  });
</script>
